<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
        body,
        html {
            width: 100%;
            height: 100%;
            margin: 0;
            font-family: "微软雅黑";
            font-size: 14px;
        }

        #allmap {
            height: 100%;
            width: 100%;
        }

    </style>
    <script type="text/javascript"
            src="http://api.map.baidu.com/api?v=2.0&ak=KyKYGhKT1DYisflH6Lk8OeGxEUYrFKRS"></script>
</head>

<body>
<div id="allmap"></div>
</body>

</html>


<script type="text/javascript">
    (function(){

        // 百度地图API功能
        function G(id) {
            return document.getElementById(id);
        }
        var map = new BMap.Map("allmap",{enableMapClick:false});
        //var myValue;
        var mk ;
        var local=null;
        let butten =window.parent.document.getElementById("butten"); //搜索位置
        let address =window.parent.document.getElementById("addAddress");//添加地址
        let latitudeAndLongitude = window.parent.document.getElementById("addLatitudeAndLongitude");
        var geolocation = new BMap.Geolocation();
        var gc = new BMap.Geocoder();//创建地理编码器
        geolocation.getCurrentPosition(function(r){
            if(this.getStatus() == BMAP_STATUS_SUCCESS){
                point = new BMap.Point(r.point.lng,r.point.lat);
                map.centerAndZoom(point, 15);
            }
            showInfo(r);
        });

        map.enableScrollWheelZoom();//开启鼠标滚轮缩放
        function myFun() {
            var pp = local.getResults().getPoi(0).point; //获取第一个智能搜索的结果
            map.centerAndZoom(pp, 18);
            map.addOverlay(new BMap.Marker(pp)); //添加标注
        }

        function showInfo(e){
            latitudeAndLongitude.value= e.point.lng + ',' + e.point.lat;
            gc.getLocation(e.point, function(rs){
                var addComp = rs.addressComponents;
                var site = addComp.province +addComp.city +addComp.district + addComp.street + addComp.streetNumber;
                address.value=site;
            });
            map.clearOverlays(); //清除地图上所有覆盖物
            mk = new BMap.Marker(e.point);
            map.addOverlay(mk);
            map.panTo(e.point);

        }
        butten.addEventListener("click", function() {//点击搜索
            map.clearOverlays(); //清除地图上所有覆盖物
            local = new BMap.LocalSearch(map, { //智能搜索
                onSearchComplete: myFun
            });

            let sear =address.value;
            local.search(sear);

            // 将地址解析结果显示在地图上,并调整地图视野
            gc.getPoint(sear, function(point){
                if (point) {
                    latitudeAndLongitude.value  = point.lng +","+ point.lat;
                    map.centerAndZoom(point, 16);
                    map.addOverlay(new BMap.Marker(point));
                }else{
                    alert("您选择地址没有解析到结果!");
                }
            }, "合肥市");

        });
        map.addEventListener("click", function (e) {
            showInfo(e);
        });
    })();
</script>